import React, { useEffect, useRef,useState } from 'react'
import { Button, Form, Input, Select, message, Modal } from "antd";
import { post } from "../../util/post"
import PubSub from 'pubsub-js';
export default function EditResourceModal(props) {
    const { v, setV } = props
    const ref = useRef()
    const token = localStorage.getItem('TOKEN')
    const [id,setId] = useState()
    useEffect(() => {
        PubSub.subscribe('editResource', (msg, data) => {
            // console.log(data)
            const { id, method, uri, description } = data
            setId(id);
            ref.current.setFieldsValue({
                method,
                uri,
                description
            })
        })
    }, [props])
    const onFinish = async (values) => {
        values.id=id;

        // console.log(values, 'post')
        const res = await post('/user/permission/update', values, token)
        const { code, msg } = res.data;
        if (code === 0) {
            message.success(msg)
            setV(false)
        } else message.error(msg)
    };
    const onFinishFailed = (errorInfo) => {
        message.error(errorInfo);
    };
    const handleEditCancel = () => {
        setV(false)
    }
    return (
        <Modal title="编辑角色资源" visible={v} footer={null} onCancel={handleEditCancel}>
            <Form name="basic" labelCol={{ span: 6 }}
                wrapperCol={{ span: 16 }}
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}
                autoComplete="off"
                ref={ref}
            >
                <Form.Item
                    label="请求方法"
                    name="method"
                    rules={[
                        {
                            required: true,
                            message: '此为必填项',
                        },
                    ]}
                >
                    <Select>
                        <Select.Option value="GET">GET</Select.Option>
                        <Select.Option value="POST">POST</Select.Option>
                        <Select.Option value="PUT">PUT</Select.Option>
                    </Select>
                </Form.Item>
                <Form.Item
                    label="接口uri"
                    name="uri"
                    rules={[
                        {
                            required: true,
                            message: '此为必填项',
                        },
                    ]}
                >
                    <Input></Input>
                </Form.Item>
                <Form.Item
                    label="描述"
                    name="description"
                    rules={[
                        {
                            required: true,
                            message: '此为必填项',
                        },
                    ]}
                >
                    <Input></Input>
                </Form.Item>
                <Form.Item
                    wrapperCol={{
                        offset: 8,
                        span: 16,
                    }}
                >
                    <Button type="primary" htmlType="submit">
                        提交
                    </Button>
                </Form.Item>
            </Form>
        </Modal>

    )
}
